﻿@model Capstone_20130302.Models.Order
@{
    ViewBag.Title = "Order # " +  Model.OrderId;
}


<script src="~/Scripts/jquery.dataTables.js"></script>
<script src="~/Scripts/dataTables.bootstrap.js"></script>


<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $('#example').dataTable({
            "sDom": "<'row spare-down'<'span4'f><'span3'l>r>t<'row'<'span3'i><'span8'p>>",
            "sPaginationType": "bootstrap",
            "oLanguage": {
                "sLengthMenu": "_MENU_ records per page"
            }
        });
    });
</script>

<legend>Order Summary</legend>
<div class="well">
    <table class="table">
        <tr>
            <th class="span3">Order Date</th>
            <td>@Model.OrderDate</td>
        </tr>
        <tr>
            <th>Order Status</th>
            <td>
                 <span class="or-@Model.StatusId" id="StatusName">@Model.Status.Name</span> 
                  <input id="@Model.StatusId" class="btn btn-small button_Changestatus" type="button" value ="" />

            </td>
          
        </tr>
        <tr>
            <th>Total Payment</th>
            <td>@Model.TotalPayment</td>
        </tr>
        <tr>
            <th>Billing Address</th>
            <td>
                @Model.BillingName <br />
                @Model.BillingAddress.Number @Model.BillingAddress.Street, @Model.BillingAddress.City
                <br /> @Model.BillingAddress.State, @Model.BillingAddress.Zipcode, @Model.BillingAddress.Country
            </td>
        </tr>
        <tr>
            <th>Shipping Information</th>
            <td>
                @if (Model.IsUsedAsShipping == false)
                {
                    @Model.ShippingName <br />
                    @Model.ShippingAddress.Number @Model.ShippingAddress.Street<text>, </text> @Model.ShippingAddress.City
                    <br /> @Model.ShippingAddress.State<text>, </text> @Model.ShippingAddress.Zipcode<text>, </text> @Model.ShippingAddress.Country
                }
                else
                {
                    <p>The same with Billng Address</p>
                }
            </td>
        </tr>
    </table>
</div>



@if (Model.OrderDetails.ToList().Count > 0)
{
    <legend>Order Details</legend>
    <div class="form-inline data-content">
        <table cellpadding="0" cellspacing="0" border="0" class="display table table-striped table-bordered" id="example">
            <thead>
                <tr>
                    <th>Item Name
                    </th>
                    <th>Price
                    </th>
                    <th>Amount
                    </th>
                    <th>Total Price
                    </th>
                </tr>
            </thead>
            <tbody>

                @foreach (var item in Model.OrderDetails)
                {
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.Product.Name)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.SoldPrice)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Amount)
                        </td>
                        
                         <td>
                            $@(item.Amount*item.SoldPrice)
                        </td>
@*                        <td data-pid="@item.OrderId" id= "status-@item.OrderId">
                            @Html.DisplayFor(modelItem => item.Status.Name)
                        </td>*@
                    </tr>
                }
            </tbody>

        </table>
    </div>
}
else
{
    <text>Sorry, no order detail.</text>
}
<script>

    $(document).ready(function () {
        var id = $(".button_Changestatus").attr('id');
        if (id == 5) {
            id = 0;
        }
        $.getJSON("/Order/GetNameStatusByID/" + (parseInt(id)+1), function (data) {
            if (data) {
                $(".button_Changestatus").attr('value', data);
            }
        });
    });

    $(".button_Changestatus").click(function () {
        if (confirm('Are you sure change status')) {
            var id = $(".button_Changestatus").attr('id');
            if (id == 5) {
                id = 0;
            }
            var num = parseInt(id) + 1;
            $.getJSON("/Order/UpdateOrderStatus?ID=@Model.OrderId&StatusID=" + num, function (data) {
                if (data) {
                    $(".button_Changestatus").attr('id', num);
                    if (num == 5) {
                        num = 0;
                    }
                    num = parseInt(num) + 1;
                    $.getJSON("/Order/GetNameStatusByID/" + num, function (data) {
                        if (data) {
                            var value = $(".button_Changestatus").attr('value');
                            $('#StatusName').text(value);
                            $(".button_Changestatus").attr('value', data);
                        }
                    });
                }
            })
        }
    });

</script>
